<!DOCTYPE html>
<html lang="en">
<head>
<!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap-grid.css" rel="stylesheet"> -->
	<link href="../vendor/bootstrap-grid.css" rel="stylesheet">
<meta charset="utf-8"/>
<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/favicon.ico">
<link rel="icon" type="image/png" href="../assets/img/favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport'/>



<!-- Font Awesome Icons -->
<!-- <link rel="stylesheet" href="#" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous"> -->
    <link rel="stylesheet" href="#"  crossorigin="anonymous">

<!-- Main CSS -->
<link href="../assets/css/main.css" rel="stylesheet"/>

<!-- Animation CSS -->
<link href="../vendor/aos.css" rel="stylesheet"/>
<style type="text/css">
	#main,#main2 {
		width: 550px;
		height: 350px;

	}
</style>
</head>

<body>


<main class="container">

<!--------------------------------------
PRICING
--------------------------------------->
<section class="pt-4 pb-5">
<div class="col-md-12 row" id="probation">
	<div class="col-md-6">
		<select>
			<option>短信数据</option>
			<option>征信数据</option>
		</select>
		<div id="main"></div>
	</div>
	<div class="col-md-6">
		<select>
			<option>1月</option>
			<option>2月</option>
			<option>3月</option>
			<option>4月</option>
			<option>5月</option>
			<option>6月</option>
			<option>7月</option>
			<option>8月</option>
		</select>
		<div id="main2"></div>
	</div>
</div>

</section>

</main>

<!--------------------------------------
JAVASCRIPTS
--------------------------------------->
<script src="../vendor/jquery.min.js" type="text/javascript"></script>
<script src="../vendor/popper.min.js" type="text/javascript"></script>
<script src="../vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="../vendor/share.js" type="text/javascript"></script>
<script src="../js/functions.js" type="text/javascript"></script>
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/js/bootstrap.bundle.js"></script> -->
<script src="../vendor/bootstrap.bundle.js"></script>
<script src="../assets/layui/layui.js" type="text/javascript"></script>
<!-- <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script> -->
<script src="../vendor/echarts.min.js"></script>
<script src="../js/tool.js" type="text/javascript"></script>

<!-- Animation -->
<script src="../vendor/aos.js" type="text/javascript"></script>


<script>
	$(function () {
		var dataInfo = {};
		var templateArr = [];
		var Type = 0;
		function getUrlParam(name) {
				  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
				  var r = window.location.search.substr(1).match(reg);  //匹配目标参数
				  if (r != null) return unescape(r[2]); return null; //返回参数值
		}
		DataRequest();
	    function DataRequest(){
			$.ajax({
       timeout:30000,
				type:'GET',
				url:window.Http+"/customer/application/info?applicationId="+getUrlParam('dataId'),
				headers: {
				　　'Authorization':"Bearer "+sessionStorage.getItem('Token')
				},
				success:function (res){
				   if(res.code == 200){
					    $("#dataTitle").text(res.data.chineseName);
						$("#introduce").text(res.data.describeContent);
				   }
				}
			})
		  $.ajax({
       timeout:30000,
		  	type:'GET',
		  	url:window.Http+"/customer/server/item?serverId="+getUrlParam('serverId'),
		  	headers: {
		  	　　'Authorization':"Bearer "+sessionStorage.getItem('Token')
		  	},
		  	success:function (res){
		  	   if(res.code == 200){
				   dataInfo = res.data;
				   Type = res.data.type;
		  	   }else if(res.code == 401){
				   layer.msg("请先进行登录操作");
			   }
		  	}
		  })
	    }




	})
</script>
<script type="text/javascript">
        var myChart = echarts.init(document.getElementById('main'));
		var myChart2 = echarts.init(document.getElementById('main2'));
        // 指定图表的配置项和数据
        var option = {
		  tooltip: {
			trigger: 'axis'
		  },
		  legend: {
			data: ['88（元）', '120（元）', '150（元）'],
			right: '1%'
		  },
		  grid: {
			left: '3%',
			right: '4%',
			bottom: '3%',
			containLabel: true
		  },
		  xAxis: {
			type: 'category',
			boundaryGap: false,
			data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
		  },
		  yAxis: {
			type: 'value',
			name:'销量（份）',
		  },
		  series: [
			{
			  name: '88（元）',
			  type: 'line',
			  stack: 'Total',
			  data: [120, 132, 101, 134, 90, 230, 210, 90, 230, 210]
			},
			{
			  name: '120（元）',
			  type: 'line',
			  stack: 'Total',
			  data: [220, 182, 191, 234, 290, 330, 310, 290, 330, 310]
			},
			{
			  name: '150（元）',
			  type: 'line',
			  stack: 'Total',
			  data: [150, 232, 201, 154, 190, 330, 410, 190, 330, 410]
			},
		  ]
		};

		var option2 = {
		  tooltip: {
		    trigger: 'axis',
		    axisPointer: {
		      type: 'shadow'
		    }
		  },
		  legend: {
		    data: ['88（元）', '120（元）', '150（元）'],
			right: '1%'
		  },
		  grid: {
			left: '3%',
			right: '4%',
			bottom: '3%',
			containLabel: true
		  },
		  toolbox: {
		    show: true,
		    orient: 'vertical',
		    left: 'right',
		    top: 'center'
		  },
		  xAxis: [
		    {
		      type: 'category',
		      axisTick: { show: false },
		      data: ['短信产品', '企业征信产品', 'CT影像产品']
		    }
		  ],
		  yAxis: [
		    {
		      type: 'value'
		    }
		  ],
		  series: [
		    {
		      name: '88（元）',
		      type: 'bar',
		      barGap: 0,
		      emphasis: {
		        focus: 'series'
		      },
		      data: [320, 332, 301]
		    },
		    {
		      name: '120（元）',
		      type: 'bar',
		      emphasis: {
		        focus: 'series'
		      },
		      data: [220, 182, 191]
		    },
		    {
		      name: '150（元）',
		      type: 'bar',
		      emphasis: {
		        focus: 'series'
		      },
		      data: [150, 232, 201]
		    }
		  ]
		};
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
		myChart2.setOption(option2);
    </script>
</body>
</html>
